<!--添加用户表单-->
<div class="tab_edit">
    <form action="{:Url('loan_add_submit')}" method="post" id="loan_add_submit">
        <input type="hidden" name="loan_product_id" value="{$loan_product_id}"/>
        <table width="100%" class="list">
            <tr>
                <td class="t_r t_left_w">贷款产品名称：</td>
                <td class="t_l">{:widget("common/Input/input",array("loan_product_name",$loan_info['loan_product_name'],true,false))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">贷款产品机构：</td>
                <td class="t_l">{:widget("common/Input/input",array("loan_agency_name",$loan_info['loan_agency_name'],true,false))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">贷款产品概要：</td>
                <td class="t_l">{:widget('common/TextArea/text_area',array('loan_product_outline',$loan_info['loan_product_outline'],true,false,"width:70%"))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">抵押方式：</td>
                <td class="t_l">{:widget('common/Radio/radio',array('loan_pledge','loan_pledge',$loan_info['loan_pledge'],true))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">还款方式：</td>
                <td class="t_l">{:widget('common/Radio/radio',array('loan_repayment','loan_repayment',$loan_info['loan_repayment'],true))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">是否要求有车：</td>
                <td class="t_l">{:widget('common/Radio/radio',array('is_car','is_car',$loan_info['is_car'],true))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">是否要求有保单：</td>
                <td class="t_l">{:widget('common/Radio/radio',array('is_policy','is_policy',$loan_info['is_policy'],true))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">是否要求有房：</td>
                <td class="t_l">{:widget('common/Radio/radio',array('is_house','is_house',$loan_info['is_house'],true))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">职业身份要求：</td>
                <td class="t_l">{:widget('common/CheckBox/checkbox',array('loan_identity','loan_identity',$loan_info['loan_identity_list'],null,null,true,false))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">自定义标签：</td>
                <td class="t_l">
                    <div class="add_label">
                        {empty name="$loan_info['loan_tag_str']"}
                        <input type="hidden" name="add_list"/>
                        {else/}
                        <input type="hidden" name="add_list" value="{$loan_info['loan_tag_str']},"/>
                        {/empty}
                        <div class="add_label_box">
                            {empty name="$loan_info['loan_tag_str']"}
                            {else/}
                            {foreach name="$loan_info['loan_tag_ary']" item="info"}
                            <span onclick="det_label(this)">{$info}</span>
                            {/foreach}
                            {/empty}
                        </div>

                        <label id="add_btn">添加标签</label>
                        <label id="add_input">
                            <input name="user_label" type="text"/>
                            <a onclick="seve_label()">保存</a>
                        </label>

                    </div>
                </td>
            </tr>
            <tr>
                <td class="t_r t_left_w">有效区域：</td>
                <td class="t_l">
                    <div class="lists-tab-cont" style="width: 810px;border: 1px solid #ddd;">
                        <table width="100%" cellpadding="0" cellspacing="0" border="0">
                            <thead>
                            <tr>
                                <th width="70%" class="tabSort-header">有效区域省份/城市<font color="red">（默认：不填表示全国有效！)</font></th>
                                <th width="30%" class="tabSort-header">操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr id="area_extend">
                                <td>{:widget('common/Select/select_group',array('loan_area',array($area_list,"area_id","acronym","parent_id"),0))}</td>
                                <td><a id="area_add" href="javascript:void(0);" class="blue"><b>添加</b></a></td>
                            </tr>
                            {foreach name="product_area_list" item="info"}
                            <tr class="info">
                                <td><input type="hidden" name="area[]" value="{$info['province']},{$info['city']}">{:widget('common/Name/area',array($info['province']))}、{:widget('common/Name/area',array($info['city']))}</td>
                                <td><a class="del" href="javascript:void(0);" class="blue"><b>删除</b></a></td>
                            </tr>
                            {/foreach}
                            </tbody>
                        </table>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="t_r t_left_w">最小/最大贷款金额 ：</td>
                <td class="t_l">{:widget("common/Input/input",array("min_loan_money",$loan_info['min_loan_money'],true,false))}（单位：万元）～{:widget("common/Input/input",array("max_loan_money",$loan_info['max_loan_money'],true,false))}（单位：万元）</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">最小/最大贷款期限 ：</td>
                <td class="t_l">{:widget("common/Input/input",array("min_period",$loan_info['min_period'],true,false))}（单位：月数）～{:widget("common/Input/input",array("max_period",$loan_info['max_period'],true,false))}（单位：月数）</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">月利率：</td>
                <td class="t_l">{:widget("common/Input/input",array("month_rate",$loan_info['month_rate'],true,false))}%</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">一次性费用：</td>
                <td class="t_l">{:widget("common/Input/input",array("nonrecurring_rate",$loan_info['nonrecurring_rate'],true,false))}%</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">详细内容：</td>
                <td class="t_l">{:widget('common/TextArea/text_area',array('loan_content_txt',$loan_info['loan_content_txt'],false,false,"width:800px;"))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">详细图片：</td>
                <td class="t_l">{:widget('common/Images/wos',array('loan_content_img','loan',$loan_info['loan_content_img'],true,false))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">排序：</td>
                <td class="t_l">{:widget("common/Input/input",array("order_by",$loan_info['order_by'],false,false))}</td>
            </tr>
            <tr>
                <td class="t_r t_left_w">备注：</td>
                <td class="t_l">
                    {:widget('common/TextArea/text_area',array('remark',$loan_info['remark'],false,false,"width:85%"))}
                </td>
            </tr>
            <tr>
                <td class="t_r t_left_w"></td>
                <td class="t_l">
                    <div class="btn"><input type="submit" class="but_blue" value="保存信息"></div>
                </td>
            </tr>
        </table>
    </form>
</div>
<style>
    .add_label{
    }
    .add_label .add_label_box{
        display: inline-block;
    }
    .add_label span{
        margin: 10px 0;
        display: inline-block;
        height: 26px;
        padding: 0 30px;
        line-height: 26px;
        text-align: center;
        border: 1px solid #ccc;
        margin-right: 10px;
        position: relative;
        cursor: pointer;
    }
    .add_label span::after{
        content: '×';
        display: block;
        width: 20px;
        height: 20px;
        line-height: 20px;
        text-align: center;
        color: #ff0000;
        position: absolute;
        right: 2px;
        top: 2px;
    }
    .add_label label{
        display: inline-block;
        height: 26px;
        padding: 0 30px;
        line-height: 26px;
        text-align: center;
        border: 1px solid #ccc;
        margin-right: 10px;
    }
    .add_label label#add_btn{
        border-color: #3b77e3;
        color: #3b77e3;
        cursor: pointer;
    }
    .add_label label#add_input{
        padding: 0;
        border-color: #3b77e3;
        color: #999;
        display: none;
    }
    .add_label label#add_input a{
        display: inline-block;
        background: none;
        border: none;
        background-color: #3b77e3;
        width: 50px;
        text-align: center;
        height: 26px;
        line-height: 26px;
        color: #fff;
        cursor: pointer;
    }
    .add_label label#add_input input{
        height: 22px;
        line-height: 22px;
        position: relative;
        top: -2px;
    }
</style>

<!-- JS处理 -->
<script language="javascript">
    //添加
    $('#add_btn').click(function(){

        //隐藏按钮显示输入框
        $(this).hide().siblings('#add_input').css("display","inline-block");
        //自动聚焦
        $('#add_input input').focus();

    });

    //删除
    function det_label(thas,id){
        //询问框
        layer.confirm('确认删除该标签？', {
            btn: ['确定','取消'] //按钮
        }, function(){

            //取得当前点击的索引
            var index = $(thas).index();

            if(id!=undefined){
                $("input[name=det_list]").val(id+','+$("input[name=det_list]").val());
            }else{
                var add_val = $("input[name=add_list]").val();
                $("input[name=add_list]").val('');
                var add_list = add_val.split(",");
                for(var i in add_list){
                    if(add_list[i]!=$(".add_label_box span").eq(index).html()&&add_list[i]!=""){
                        $("input[name=add_list]").val(add_list[i]+','+$("input[name=add_list]").val());
                    }
                }
            }

            var dom = $(".add_label_box span");
            $(".add_label_box span").eq(index).remove();

            layer.msg('删除成功', {icon: 1});
        }, function(){

        });


    }

    //保存
    function seve_label(){

        var dom = $(".add_label_box");
        var v = $('input[name=user_label]').val();
        if (v == ''){

            alert('标签不能为空')
            return;
        }else if (v.length<4||v.length>7){
            alert('标签在4到7个字之间')
            return
        }else if ($('.add_label_box span').length>=6){
            alert('标签最多只能6个')
            return
        }
        $('input[name=user_label]').val('');
        dom.append("<span onclick='det_label(this)'>"+v+"</span>");

        $("input[name=add_list]").val(v+','+$("input[name=add_list]").val());

        //隐藏按钮显示输入框
        $('#add_input').css("display","none");
        $('#add_btn').show();

    }
    $(function(){
        //有效区域
        var area_tpl = {
            getTemplate : function(info){
                return  '<tr class="info"><td><input type="hidden" name="area[]" value="' + info.data + '">' + info.content + '</td><td><a class="del" href="javascript:void(0);" class="blue"><b>删除</b></a></td></tr>';
            }
        };

        //申请条件
        var condition_tpl = {
            getTemplate : function(info){
                return  '<tr class="info"><td><input type="text" name="condition[]" style="width: 100%;" value="' + info.data + '"></td><td><a class="del" href="javascript:void(0);" class="blue"><b>删除</b></a></td></tr>';
            }
        };

        //申请材料
        var material_tpl = {
            getTemplate : function(info){
                return  '<tr class="info"><td><input type="text" name="material[]" style="width: 100%;" value="' + info.data + '"></td><td><a class="del" href="javascript:void(0);" class="blue"><b>删除</b></a></td></tr>';
            }
        };

        //添加关联有效区域
        $("a#area_add").click(function(){
            //初期化变量
            var area = $("select[cache='loan_area'] option:selected");
            var province_id = parseInt(area.eq(0).val());
            var province_name = area.eq(0).text();
            var city_id = parseInt(area.eq(1).val());
            var city_name = area.eq(1).text();

            //判断是否数据是否存在
            if(province_id > 0 && city_id > 0) {
                //添加到列表中
                $("tr#area_extend").after(area_tpl.getTemplate({
                    data: province_id + "," + city_id,
                    content: province_name + "、" + city_name
                }));
            }else{
                alert("请选择有效区域的省份及城市！");
            }
        });

        //添加申卡条件
        $("a#condition_add").click(function(){
            //初期化变量
            var condition = $("input[name='loan_apply_condition']");
            var condition_data = $.trim(condition.val());

            //判断是否数据是否存在
            if(condition_data != "") {
                //添加到列表中
                $("tr#condition_extend").after(condition_tpl.getTemplate({
                    data: condition_data
                }));

                //清除历史状态
                condition.val("");
            }else{
                alert("请选输入申卡条件！");
            }
        });

        //添加申请材料
        $("a#material_add").click(function(){
            //初期化变量
            var material = $("input[name='loan_apply_material']");
            var material_data = $.trim(material.val());

            //判断是否数据是否存在
            if(material_data != "") {
                //添加到列表中
                $("tr#material_extend").after(material_tpl.getTemplate({
                    data: material_data
                }));

                //清除历史状态
                material.val("");
            }else{
                alert("请选输入申卡条件！");
            }
        });

        //删除关联有效区域
        $("a.del").live("click",function(){
            //删除多余数据
            $(this).parents("tr.info").remove();
        });

        //利率的合计
        $("input[name='rate_info[min_rate]'], input[name='rate_info[min_fee]']").change(function(){

            $min_rate   =  $("input[name='rate_info[min_rate]']").val()?parseFloat($("input[name='rate_info[min_rate]']").val()):0;
            $min_fee    =  $("input[name='rate_info[min_fee]']").val()?parseFloat($("input[name='rate_info[min_fee]']").val()):0;
            $total_rate = $min_rate + $min_fee;

            $('input[name=total_rate]').val($total_rate);
        });


    });
</script>
